<template>
	<view class="allMassagePage" ref="allMasspage" :style="{display:cssstyle}">
		<!-- 开启下拉刷新和无数据显示图片 1 -->
		<z-paging ref="pagingq" v-model="isShowBox" :fixed="false" :auto="false" :refresher-enabled="false"
			:loading-more-no-more-text="''" :show-loading-more-no-more-line="false"
			:empty-view-style="{'margin-top':'-200rpx'}">
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y">
				<view class="allMassagePage-school">
					<!-- 学校列表 -->
					<text v-show="isshow==0" class="container-list-title">院校</text>
					<view v-show="isshow==0" class="container-list">
						<view class="container-scroll">

							<search-collegecell class="college-item" v-for="(item,index) in collegeList" :key="item.sid"
								:isShowContrastBtn="false" :data="item"
								:isSelect="getFindIndexToContrastList(item) >= 0" @tap="onClickCollegeCell(item)"
								@onClickAddContrast="onClickAddContrast"></search-collegecell>

						</view>
					</view>

					<view v-show="isshow==0" class="divding-line"></view>

					<!-- 文章 -->
					<view class="allMassagePage-article" v-show="changeBoxIsShowList.articleMsg==1">
						<text class="container-list-title">文章</text>
						<uni-list :border="false">

							<uni-list-item :border="false" :title="item.title"
								:note="item.source + '&nbsp&nbsp' + $tool.timeago(item.update_time)"
								v-for="item in artcleMsgData" :key="item.id" link @click="onClick1(item)">
								<template v-slot:footer>
									<view class="uni-thumb" style="margin: 0;">
										<image class="slot-image" :src="item.image_url" mode="widthFix"></image>
									</view>
								</template>
							</uni-list-item>

						</uni-list>

						<!-- 	<articleMsg :datanumber="datanumber" :inputValue="inputValue"
							@changeBoxIsShow="changeBoxIsShow">
						</articleMsg> -->
					</view>
					<!-- 职业 -->

					<view v-show="changeBoxIsShowList.articleMsg==1" class="divding-line"></view>
					<view class="allMassagePage-jobMsg" v-show="changeBoxIsShowList.jobMsg==1">
						<text class="container-list-title">职业</text>
						<!-- 	<jobMsg :datanumber="datanumber" :inputValue="inputValue" @changeBoxIsShow="changeBoxIsShow">
						</jobMsg> -->
						<view class="view-lint-bg">
							<uni-list :border="false">
								<uni-list-item link showArrow :title="item.name" v-for="item in jobsList"
									:key="item.code" @click="onCellClick(item.code)">
								</uni-list-item>
							</uni-list>

						</view>
					</view>
					<!-- 专业盒子 -->
					<view v-show="changeBoxIsShowList.majorMassage==1" class="divding-line"></view>
					<view class="allMassagePage-major" v-show="changeBoxIsShowList.majorMassage==1">
						<text class="container-list-title">专业</text>
						<uni-list :border="false">
							<uni-list-item link showArrow :title="item.name"
								:note="item.eduLevelName?item.eduLevelName:''" v-for="item in majorMsgData"
								:key="item.code" @click="clickbackMajors(item)">
							</uni-list-item>
						</uni-list>
					</view>
				</view>

			</scroll-view>

		</z-paging>
		<!-- 	<view v-else class="positionBox">
			<image src="https://mcdn.chatgk.com/xcx/static/images/wode/wodehuiyuanka.png" mode=""></image>
			<text>没有数据哦~</text>
		</view> -->
		<loading v-show="loadshow"></loading>
	</view>
</template>

<script>
	// import majorMassage from "./majorMassage.vue"
	// import articleMsg from "./articleMassage.vue"
	// import jobMsg from "./jobMassage.vue"
	export default {
		// components: {
		// 	// majorMassage,
		// 	articleMsg,
		// 	jobMsg
		// },
		props: {
			datanumber: {
				type: Number,
				default: 3
			},

			inputValue: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				loadshow: false,
				isshow: 0,
				scrollTop: 0,
				collegeList: [],
				page: 1,
				searchKey: "", //搜索的值
				selFilterDatas: {},
				contrastList: [],
				changeBoxIsShowList: {
					majorMassage: 1,
					articleMsg: 1,
					jobMsg: 1
				},
				isShowBox: [1, 2],
				positionBox: 1, //我是职业页面的状态 如果没有数据那么就为空
				cssstyle: "none",
				majorMsgData: [], //专业数据
				pageSize: 3,

				artcleMsgData: '', //文章数据
				jobsList: [], //职业数据
				submodelIndexs: [],
			}
		},
		methods: {
			// 传递一个方法到子组件中  通过子组件返回的数据是否为0来判断是否显示该盒子
			changeBoxIsShow(data, data2) {

				switch (data) {
					case "majorMassage":
						this.changeBoxIsShowList.majorMassage = data2;
						break;
					case "articleMsg":
						this.changeBoxIsShowList.articleMsg = data2;
						break;
					case "jobMsg":
						this.changeBoxIsShowList.jobMsg = data2;
						break;
				}

			},
			// 获取学校列表数据
			onClickAddContrast(data) {
				let index = this.getFindIndexToContrastList(data)
				if (index >= 0) {
					this.contrastList.splice(index, 1)
				} else {
					this.contrastList.unshift(data)
				}

				this.$userManager.setContrastList(this.contrastList)
			},



			// 获取元素在ContrastList数组中的下标
			getFindIndexToContrastList(data) {
				return this.contrastList.findIndex(item => item.sid == data.sid)
			},
			// 点击学校列表
			onClickCollegeCell(college) {
				// if (this.$userManager.isLogin()) {
				uni.navigateTo({
					url: '/subpackages/subpackage1/pages/searchcollege/collegeDetails/college-details?data=' + JSON
						.stringify(college)
				})
				// }
			},
			clickbackMajors(majors) {
				// 根据层级判断跳转页面
				if (majors.level == 3) {
					this.getMajorCellId(majors.code)
				} else {
					// uni.navigateTo({
					// 	url: "/subpackages/subpackage1/pages/searchmajor/search-major-list?majorsArr=" + encodeURIComponent(JSON.stringify(
					// 		majors))
					// })
					uni.setStorageSync("majorClass", majors)
					uni.navigateTo({
						url: '/subpackages/subpackage1/pages/searchmajor/see-major-class'
					})
				}
			}
			// 点击列表进行一个跳转到对应页面
			,
			onClick(data) {
				uni.navigateTo({
					url: "/subpackages/subpackage1/pages/searchcollege/collegeDetails/news-details?data=" +
						encodeURIComponent(JSON
							.stringify(data))
				})
			},
			getMajorCellId(special_id) {
				uni.navigateTo({
					url: "/subpackages/subpackage1/pages/searchmajor/search-major-majordetail?code=" + special_id
				})
			},
			// 点击列表进行一个跳转到对应页面
			onClick1(data) {
				uni.navigateTo({
					url: "/subpackages/subpackage1/pages/searchcollege/collegeDetails/news-details?data=" +
						encodeURIComponent(JSON
							.stringify(data))
				})
			},

			onCellClick(e) {
				uni.navigateTo({

					url: "/subpackages/subpackage1/pages/seejob/seejobdetail?code=" + e
				})
			},
			isShow(hederIndex, index) {
				let arr = this.submodelIndexs[hederIndex]
				if (!arr) {
					arr = []
				}

				return arr.some(item => item == index)
			},
			// 点击列表执行
			onClickSubmodelCell(headerIndex, index) {
				let arr = this.submodelIndexs[headerIndex]
				if (!arr) {
					this.submodelIndexs[headerIndex] = []
					arr = []
				}

				const findIndex = arr.findIndex(item => item == index)
				if (findIndex >= 0) {
					arr.splice(findIndex, 1)
				} else {
					arr.push(index)
				}

				this.submodelIndexs[headerIndex] = arr
			},
			// 发送聚合搜索请求
			sendSearchRequest(page = 1, pageSize = 3) {
				let data = {
					search: this.searchKey,
					page,
					pageSize
				}
				this.loadshow = true
				this.$request.searchType(data).then(res => {
					this.loadshow = false
					for (let item of res.data) {
						if (item.searchType == "school") {
							this.collegeList = item.data || []
						} else if (item.searchType == "major") {
							this.majorMsgData = item.data || []
						} else if (item.searchType == "job") {
							this.jobsList = item.data || []
						} else if (item.searchType == "news") {
							this.artcleMsgData = item.data || []
						}
					}

					if (this.collegeList.length == 0 &&
						this.majorMsgData.length == 0 &&
						this.jobsList.length == 0 &&
						this.artcleMsgData == 0) {
						this.$refs.pagingq.complete([])
					}
				}).catch(err => {
					this.loadshow = false
				})
			}


		},
		watch: {
			inputValue: {
				handler() {
					this.searchKey = this.inputValue
					this.sendSearchRequest(1, 3)
					this.isshow = 0
				},
				deep: true,
				immediate: true
			},
			collegeList: {
				handler() {
					if (this.collegeList.length == 0) {
						this.isshow = 1
					} else {
						this.isshow = 0
					}

				},
				deep: true,
				immediate: true
			},

			majorMsgData: {
				handler() {
					if (this.majorMsgData.length == 0) {
						this.changeBoxIsShowList.majorMassage = 0
					} else {
						this.changeBoxIsShowList.majorMassage = 1
					}
				},
				deep: true,
				immediate: true
			},
			artcleMsgData: {
				handler() {
					if (this.artcleMsgData.length == 0) {
						this.changeBoxIsShowList.articleMsg = 0
					} else {
						this.changeBoxIsShowList.articleMsg = 1
					}
				},
				deep: true,
				immediate: true
			},
			jobsList: {
				handler() {
					if (this.jobsList.length == 0) {
						this.changeBoxIsShowList.jobMsg = 0
					} else {
						this.changeBoxIsShowList.jobMsg = 1
					}
				},
				deep: true,
				immediate: true
			},
			changeBoxIsShowList: {
				handler() {
					// this.$refs.pagingq.complete(this.isShowBox)
					let num = 0
					for (let item in this.changeBoxIsShowList) {
						if (this.changeBoxIsShowList[item] == 0) {
							num++
						}
					}
					// 另外对页面上的院校显示与否进行判断  如果不显示==1 时  则+1
					if (this.isshow == 1) {
						num++
					}
					if (num == 4) {
						setTimeout(() => {
							// this.$refs.pagingq.complete([])
						}, 10)
						// uni.$emit('z-paging-error-emit')
					} else {
						setTimeout(() => {
							this.$refs.pagingq.complete([1, 2])
							// uni.$emit('z-paging-error-emit')
						}, 10)
					}

				},
				deep: true,
				immediate: true
			},

		},



		onShow() {
			const list = this.$userManager.getContrastList()
			this.contrastList = list ? list : []
		},
		mounted() {
			this.searchKey = this.inputValue
			setTimeout(() => {
				this.cssstyle = "block"
			}, 800)

		},

	}
</script>

<style lang="scss" scoped>
	.allMassagePage {
		height: 100%;

		.scroll-Y {
			height: 100%;

		}
	}

	.allMassagePage-school {
		width: calc(100vw - 40rpx);
		margin-left: 20rpx;
	}

	.container-list {
		position: relative;
		// height: 600rpx;
		width: 100%;
	}

	.container-scroll {
		height: 100%;
		position: relative;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		width: 100%;
	}

	.college-item {
		height: 150rpx;
	}

	.container-list-title {
		margin-left: 20rpx;
		font-weight: 600;
		font-size: 28rpx;
		color: #333333;
	}

	.divding-line {
		width: 100vh;
		height: 40rpx;
	}

	//定位图片盒子
	.positionBox {
		width: 300rpx;
		height: 300rpx;
		position: absolute;
		display: flex;
		flex-direction: column;
		top: calc(50% - 150rpx - 128rpx);
		left: calc(50% - 120rpx);

		image {
			width: 100%;
			height: 80%;
		}

		text {
			width: 100%;
			text-align: center;
		}
	}

	.allMassagePage-major {
		min-height: 300rpx;
	}

	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 0px;
		width: 30px;
		height: 30px;
	}

	//职业
	.seejobtitle {
		margin: 36rpx 0 10rpx 32rpx;
		font-size: 32rpx;
		color: #464646;
	}

	.view-list-bg {
		height: 80rpx;
		padding: 0 20rpx 0 32rpx;
	}

	.text-title {
		color: #464646;
		font-size: 28rpx;
		font-weight: 400;
	}

	.text-value {
		color: #999999;
		font-size: 24rpx;
		font-weight: bold;
	}

	.text-job {
		color: #999999;
		font-size: 28rpx;
		font-weight: bold;
		padding: 10rpx 32rpx 10rpx 60rpx;
	}

	.cell-select {
		color: #FF3B0A;
	}

	.type-job {
		margin: 0 40rpx;
	}
</style>